{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% import "_macros.html" as macros %}
{% import "product/partial/batch_search_form.html" as search_product_form_macro %}

{% block title %}万屏时代报价工具--产品规格列表{% endblock %}

{% block panel_heading %}
    万屏时代报价工具--产品规格列表
    <div class="pull-right btn-group">
        <a href="{{ url_for('product_bp.add_product') }}"
           class="btn btn-xs btn-success"
           style="margin-right: 5px;" target="_self">
            新增产品
        </a>
    </div>
{% endblock %}

{% block panel_body %}
    {{ search_product_form_macro.gen_form(search_form) }}

    <table id="product-table"
           class="table table-bordered table-hover table-condensed table-striped">
        <thead>
        <tr>
            <th>产品名称</th>
            <th>品牌</th>
            <th>来源</th>
            <th>规格名</th>
            <th>规格值</th>
        </tr>
        </thead>
        <tbody id="td-info">
            {% for each in products %}
                <tr>
                    <td>{{ each.name }}</td>
                    <td>{{ each.brand }}</td>
                    {% if each.source | is_url %}
                        <td><a href="{{ each.source }}" target="_blank">查看详情</a></td>
                    {% else %}
                        <td>{{ each.source }}</td>
                    {% endif %}
                    <td>{{ each.name }}</td>
                    <td contenteditable='true' class="spec-value"
                        data-spec_id="{{ each.product_to_spec_id }}">{{ each.value }}</td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
    <br>
    <div class="pull-right btn-group">
        <button class="btn btn-primary"
                id="batch-update-btn">
            保存
        </button>
    </div>

{% endblock %}

{% block scripts %}
    {{ super() }}
    <script>
        $('#product_type_id').change(function () {
            var product_type_id = $('#product_type_id').val();
            var spec = $('#spec_id');
            spec.html('');
            $('#td-info').empty();
            $.ajax({
                url: "{{ url_for('product_bp.product_params')}}",
                data: {
                    'product_type_id': product_type_id
                },
                type: 'get',
                dataType: 'json',
                contentType: 'application/json',
                cache: true
            }).done(function (data) {
                if (data) {
                    data.forEach(function (obj) {
                        spec.append('<option value=' + obj[0] + '>' + obj[1] + '</option>')
                    })
                }
                else {
                    alert("同步失败")
                }

            }).fail(function () {
                alert("获取产品规格失败，请联系系统管理员!")
            });
        });

        var spec_map = {{ spec_map | safe }};
        // 更新规格值
        $("#batch-update-btn").click(function () {
            $("#product-table .spec-value").each(function (i, obj) {
                spec_map[$(obj).data('spec_id')] = $(obj).html();
            });
            $.ajax({
                url: "{{ url_for('product_bp.batch_update_params')}}",
                data: JSON.stringify({
                    'spec_map': spec_map
                }),
                type: 'post',
                dataType: 'json',
                contentType: 'application/json',
                cache: true
            }).done(function (data) {
                if (data) {
                    location.reload();
                }
                else {
                    alert("同步失败")
                }

            }).fail(function () {
                alert("获取产品规格失败，请联系系统管理员!")
            });
        });

    </script>
{% endblock %}